// 该文件专门用于创建整个应用的路由器
import VueRouter from 'vue-router'
//引入组件
import About from '../views/About'
import Home from '../views/Home'
import Message from '../views/Message'
import News from '../views/News'
import Detail from '../views/Detail'


//创建并暴露一个路由器
export default new VueRouter({
	routes:[
		{
			path: '/about',
			component: About
		},
		{
			path: '/home',
			component: Home,
			children: [
				{
					path:'message',
					component: Message,
					children: [
						{
							name:'detail',
							path:'detail/:id/:title',
							component: Detail,

							// props 的第一种写法, 值为对象, 该对象中的所有 key-value 都会以 props 的形式传给 Detail组件.
							props: {a:1, b:'hello'},

							// props 的第二种写法, 值为布尔值, 若布尔值为真, 就会把该路由组件收到的所有 params 参数, 以 props 的形式传给 Detail组件.
							props: true,

							// props 的第三种写法, 值为函数 支持 query 参数
							props({params: {id, title}}) {
								return {
									id,
									title,
									a: 1,
									b: 'hello'
								}
							}
						}
					]
				},
				{
					path:'news',
					component: News
				}
			]
		}
	]
})
